<template>
  <div class="xd-LearningHome-PoliticalNews-NewsHome p_10">
    <el-card class="m_t_b_5px news_panel" shadow="hover"> 
      <div slot="header">
        <div class="title">精选测试</div> 
      </div>
      <ul class="news_list item_flex_ul">
        <li v-for="p in newsList" :key="p.typeId" @click="goNewsDetail(p.typeId)">
          <!-- <span class="title">
            <span style="color:red;" v-if="p.i_is_top">【顶】</span>
            · {{ decodeURI(p.v_seach_v_notice_title)}}
          </span>
          <span class="time">{{p.dtm_publish_date}}</span> -->
          <el-row style="width: 100%"> 
              <el-col :span="20" style="font-size: 12px">
                <div style="    margin-top: 10px;">
                  <span
                    style="
                      font-weight: bold;
                      font-size:18px;
                      margin-right: 12px; 
                    "
                    >{{p.title}}</span
                  > 
                </div>
                <div style="margin-top:15px;"><span style="font-size:14px;color:#a5a0a0;">{{p.describe}}</span></div>
                <div style="font-size:14px;" v-if="false">
                  <span><i class="el-icon-edit"></i> 4349 </span>
                 <span style="margin-left:10px;"><i class="el-icon-chat-dot-square"></i> 4349 </span>
                 <span style="margin-left:10px;"><i class="el-icon-star-on"></i> 4349</span>
                </div>
              </el-col>
                <el-col :span="4">
                <div class="block">
                  <img src="@/assets/imgs/xzq-test-item.png" /> 
                </div>
              </el-col>
            </el-row>

        </li>
        <p v-if="!newsList.length" class="no-data">{{NO_DATA}}</p>
      </ul>
      <!-- <el-pagination
        @size-change="sizeChange"
        @current-change="pageChange"
        :current-page="form.pageNumber"
        :page-sizes="[10, 20, 30, 40, 50]"
        :page-size="form.pageSize"
        :layout="PAGE_LAYOUT"
        :total="total"
      ></el-pagination> -->
    </el-card>
  </div>
</template>
<script>
export default {
  name: 'FaqHome',
  data() {
    return { 
      form: {
        pageNumber: 1,
        pageSize: 10
      },
      total: 0,
      newsList: [
       { title:"智力测试",describe:'智力测试智力测试智力测试智力测试',typeId:1},
       { title:"人格测试",describe:'人格测试人格测试人格测试人格测试',typeId:2},
       { title:"兴趣测试",describe:'兴趣测试兴趣测试兴趣测试兴趣测试',typeId:3},
       { title:"焦虑与抑郁测试",describe:'焦虑与抑郁测试焦虑与抑郁测试焦虑与抑郁测试焦虑与抑郁测试',typeId:4},
       { title:"多元智能测试",describe:'多元智能测试多元智能测试多元智能测试多元智能测试',typeId:5},
       { title:"运动能力测试",describe:'运动能力测试运动能力测试运动能力测试运动能力测试',typeId:6},
       { title:"趣味测试",describe:'趣味测试趣味测试趣味测试趣味测试',typeId:7},
      ],
      slideList: [],
    }
  },
  mounted() {
   // this.getNews()
    this.fetchSlide();
  },
  methods: {
     fetchSlide() {
      utils.post("notice/RoutineFile", {}, (res) => {
        if (res.success) {
          this.slideList = res.data
            .map((item) => {
              return {
                id: item.businessId,
                title: item.title,
                summary: item.zy,
                imgSrc: item.imgUrl,
              };
            })
            .slice(0, 8);
        }
      });
    },
    getNews() {
      utils.post('/notice/list', this.form, res => {
        if (res.success) {
          this.total = res.data.total
          this.newsList = res.data.rows
        }
      })
    },
    sizeChange(val) {
      this.form.pageSize = val
      this.getNews()
    },
    pageChange(val) {
      this.form.pageNumber = val
      this.getNews()
    },
    goNewsDetail(typeId) {
      //this.$router.push({ path: '/LearningHome/NoticeCenter/Detail', query: { id: id, activeMenu: '/LearningHome/NoticeCenter' } })
       this.$router.push({
        path: "/Cinziqao/Test/Detail",
        query: { typeId: typeId, activeMenu: "/Cinziqao/Test" },
      });
    },
    goPoliticalNews(id) {
      // this.$router.push({
      //   path: "/LearningHome/PoliticalNews/NewsDetail",
      //   query: { id: id, activeMenu: "/LearningHome/PoliticalNews" },
      // });
    },
  }
}
</script>
<style lang="less">
.xd-LearningHome-PoliticalNews-NewsHome {
  .news_panel {
    ul.news_list li {
      border-bottom: solid 1px #dcdfe6;
      padding-bottom: 5px;
    }
  }
}
</style>